<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <!-- Ajax的实现步骤 -->
    <!-- 1.创建Ajax对象 -->
    <!-- var xhr = new XMLHttpRequest(); -->

    <!-- 2.告诉Ajax请求地址及请求方式 -->
    <!-- xhr.open('get','http://www.example.com') -->

    <!-- 3.发送请求 -->
    <!-- xhr.send() -->
    <!-- 由于请求受网络环境的影响 它会在不确定的时间以后 才会响应给客户端     所以不能再send后面直接接收返回的数据-->

    <!-- 4.获取服务器端与客户端的响应数据 -->
    <!-- 在xhr对象下面有个事件  onload事件  这个事件什么时候 会被触发呢  当ajax接收完服务器端的响应数据 就会触发-->
    <!-- xhr.onload = function(){
      response 响应   responseText 这个属性中保存的就是服务器端返回给客户端的数据
      console.log(xhr.responseText)
    } -->

    <!-- 服务器端响应数据格式 -->
    <!-- 在真是的项目中  服务器端大多数情况下会以JSON对象作为响应数据的格式  当客户端拿到响应数据时, 要将JSON数据和html字符串进行拼接 -->
  </body>
</html>
